//- 先去这个pug文件中找
extends ../commons/commons.pug

block append pageStyle
	link(href="${relativePath}/static/css/shopping/tjOrder.css" rel="stylesheet" type="text/css")
	link(href="${relativePath}/static/css/personCenter/myPj.css" rel="stylesheet" type="text/css")
block content
	//- 提交订单内容
	div.placeOrderCon.layout
		//- logo部分
		div.submitHeader
			div.logo.fl
				img(src="${relativePath}/static/imgs/shopin.png")
		//- 评价内容
		div.pjComment
			span.topTitle 评价
			div.contentLeftOne
				//- img(src="${relativePath}/static/imgs/clList.png")
				//- p.title 超薄LED灯箱双面灯箱
				//- ul
				//- 	li 字壳材质厚度：0.5mm
				//- 	li 字壳材质厚度：0.5mm
				//- 	li 字壳材质厚度：0.5mm
				//- 	li 字壳材质厚度：0.5mm
			div.contentRight
				div.starBox
					ul.stars
						li
							img(src="${relativePath}/static/imgs/star1.png")
						li
							img(src="${relativePath}/static/imgs/star1.png")
						li
							img(src="${relativePath}/static/imgs/star1.png")
						li
							img(src="${relativePath}/static/imgs/star1.png")
						li
							img(src="${relativePath}/static/imgs/star1.png")
				div.plContent
					textarea(max="500" placeholder="输入评论内容")
					span
						| 还可输入
						| <i>500</i>字
				//- 上传图片
				div.pjUpimg
					div.imgLeft.fl
						div.upImgBox
							div.upLoad
								input(type="hidden",name="order_img")
								div#fileUploadContent.fileUploadContent.fl
									form#uploadForm
										div.upimg-div.clear
											section.z_file.fl
												img(src="${relativePath}/static/imgs/addImg.png").add-img
												input(type="file" name="file" id="orderImg" class="file" value="" accept="image/jpg,image/jpeg,image/png,image/bmp" multiple="multiple" )
					div.rightPj.current.fr 匿名评论
					input.score(type="hidden" name="score" value="5")
				a.pjBtn(href="javascript:;") 提交评价
			div.clear
	script#pjShop(type="text/html")
		| {{set goods = data.goods}}
		img(src="{{goods.img}}")
		p.title {{goods.goods_name}}
		| {{set lists = goods.sku_list}}
		ul
			| {{each lists arr}}
			li {{arr.spec_name}}：{{arr.opt_name}}
			| {{/each}}
block append pageScript

	script.
		$(function() {
			$(".stars li").click(function(){
				var $ts = $(this);
				// alert($ts);
				var hscl = $ts.hasClass("flg");
				//alert(hscl);
				var index = $ts.index();
				//alert(index);
				if(hscl){
					if(index === 0){
						$(".stars li").removeClass("flg").children("img").attr("src","${relativePath}/static/imgs/star1.png");
					}else{
						$(".stars li:gt("+(index-1)+")").removeClass("flg").children("img").attr("src","${relativePath}/static/imgs/star1.png");
					}
				}else{
					$(".stars li:lt("+(index+1)+")").addClass("flg").children("img").attr("src","${relativePath}/static/imgs/star2.png");
				}
				$("input[name='score']").val(index+1);
			});
			//- 图片上传
			$("input#orderImg").on("change", function() {
				var wrap = $(this).closest(".upimg-div");
				doUpload_img(this.files[0], function(data) {
					var imgUrl = $("input[name='order_img']").val();
					if(imgUrl) {
						$("input[name='order_img']").val(imgUrl + "," + data.data.path);
					} else {
						$("input[name='order_img']").val(data.data.path);
					}
					wrap.prepend("<span class='imgwarp'><img src='"+data.data.url+"' path='"+data.data.path+"' class='upimgs'></img><i></i></span>");
					if($("span.imgwarp img.upimgs").length > 4) {
						$("#orderImg").hide();
						$(".add-img").hide();
					}
					
				});
			});
			//- 上传图片
			function doUpload_img(file, callback) {
				var formdata=new FormData($("#uploadForm")[0])
				//console.log(formdata);
				$.ajax({
					url:shopIp+"/Utils/uploadFiles?userToken="+token,
					type:"post",
					data:formdata,
					dataType:"json",
					async:false,
					cache:false,
					contentType:false,
					processData:false,
					success:function(data) {
						//alert(data.msg);
						//console.log(data.data.path);
						//- $(".hiddenTxt").val(data.data.path);
						callback(data);
					},
					error:function(data) {
						layer.msg(data.msg);
					}
				})
			}
			//- 点击删除图片
			$("#uploadForm").on("click",".imgwarp i",function() {
				$(this).closest(".imgwarp").remove();
				$("#orderImg").show();
				$(".add-img").show();
			})

			//- 左边商品详情
			$.get(shopIp+"/Order/info?userToken="+token+"&order_id="+thisRequest.order_id+"&user_identity='buyer'",function(data) {
				var shopMsg = template("pjShop",data);
				$(".contentLeftOne").append(shopMsg);
			})
			var anonymous;
			$(".rightPj").click(function() {
				if($(this).hasClass("current")) {
					$(this).removeClass("current");
					anonymous = 0;
				}else{
					$(this).addClass("current");
					anonymous = 1;
				}
			})
			//- 点击提交评价
			$(".pjBtn").click(function() {
				var imgsArr = [];
				$(".upimg-div img").not(".add-img").each(function() {
					imgsArr.push($(this).attr("path"));
				})
				if($(".plContent textarea").val() == "") {
					layer.msg("请输入评价内容！");
				}else{
					$.post(shopIp+"/Comment/submitComment",{
						userToken:token,
						order_id:thisRequest.order_id,
						score:$(".score").val(),
						contents:$(".plContent textarea").val(),
						imgs:imgsArr,
						is_anonymous:anonymous
					},function(data) {
						if(data.status == "200") {
							layer.msg(data.msg);
							setTimeout(function(){
								location.reload();
							},1000);
						}else{
							layer.msg(data.msg);
							setTimeout(function(){
								location.reload();
							},1000);
						}
					})
				}	
			})
		})
		


		